<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/9/11 0011
  Time: 20:27
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="f" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fnt" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
<title>问题类型管理</title>
<link rel="stylesheet" href="/manage/css/static/question-type/questionmain.css">
<link rel="stylesheet" href="/manage/css/static/question-type/zTreeStyle.css">
<script src="/manage/js/lib/question-type/jquery-3.4.1.min.js"></script>
<script src="/manage/js/lib/question-type/jquery.ztree.core.min.js"></script>
<script src="/manage/js/lib/question-type/jquery.ztree.excheck.min.js"></script>
</head>
<body>
<div style="float: left">
	<h1 style="text-align: center;color: #3b4249;">下方选择问题类型</h1>
	<ul id="treeDemo" class="ztree"></ul>
</div>
<div style="float: left;width: 600px;height:600px;margin-right: 10px;">
	<h2 style="text-align: center">添加问题</h2>
	<ul style="margin-left: 50px;list-style: none;margin-bottom: 10px;">
		<li style="margin-left: 20px;margin-top:30px;list-style: none;font-size: 18px;">选中的问题类型为:
			<input type="hidden" class="hidden-id"/>
			<input type="text" class="choice-type" disabled/>
		</li>
		<li>

		</li>
	</ul>
</div>
</body>
</html>
<script>
	//zTree的配置
	var setting = {
		view: {
			selectedMulti: false
		},
		edit: {
			enable: true,
			editNameSelectAll: true,
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			onClick:zTreeOnClick, //点击选中事件　
		}
	};
	//zTree初始化加载的节点树

	var zNodes =[
		<c:forEach items="${questionTypeList}" var="questionType" varStatus="stat">
			{id:${questionType.id},pId:${questionType.pId},name:"${questionType.name}", open:true},
		</c:forEach>
	];

	var log, className = "dark";
	function zTreeOnClick(event, treeId, treeNode) {
		var name=treeNode.name;
		var id=treeNode.id;
		$(".choice-type").val(name);
		$(".hidden-id").val(id);
	}

	$(function(){ //初始化加载树bai
		$.fn.zTree.init($("#treeDemo"), setting, zNodes);  //加载树节点信息
		var zTree=$.fn.zTree.getZTreeObj("treeDemo");
	});
</script>